<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="/js/jquery.js"></script>
</head>
<body>
    <from id="classInfo">
        班级名称:
        <input type="text" name="className" id="className"><br/>
        id:
        <input type="text" name="id" id="id"><br/>
        入学日期:
        <input type="text" name="date" id="date"><br/>
        专业:
        <input type="text" name="major" id="major"><br/>
        <input type="button" name="submit" value="提交" id="submit">
        <input type="button" name="update" value="修改" id="update"><br/>
    </from>
    <br/>
    <from id="class">
        id:
        <input type="text" name="id" id="delId"><br/>
        <input type="button" name="delete" value="删除" id="delete">
        <input type="button" name="query" value="查询" id="query"><br/>
    </from>

    <table id="tb" border="1">
        <thead>
        <th>班级名</th>
        <th>id</th>
        <th>入学年份</th>
        <th>专业</th>
        </thead>
    </table>

    <script>
        function add(){
            let className = $('#className').val();
            let id = $('#id').val();
            let date = $('#date').val();
            let major = $('#major').val();
            $.post("/class/add",{
                className:className,
                id:id,
                date:date,
                major:major
            },function (res){
                if(res=="ok"){
                    let tb = $('#tb')
                    let html = "<tr>"+
                        "<td>"+className+"</td>"+
                        "<td>"+id+"</td>"+
                        "<td>"+date+"</td>"+
                        "<td>"+major+"</td>"+
                        "</tr>"
                    tb.append(html);
                    console.log("添加成功")
                }else {
                    alert("添加失败")
                }
            })
        }
        function loadData(){
            $.get("/class/search",{},function (res){
                console.log("zhixingle")
                let tb = $('#tb')
                if (res!=null){
                    for (let i = 0; i < res.length; i++) {
                        let className = res[i].className
                        let id = res[i].id
                        let date = res[i].date
                        let major = res[i].major
                        let html = "<tr>"+
                            "<td>"+className+"</td>"+
                            "<td>"+id+"</td>"+
                            "<td>"+date+"</td>"+
                            "<td>"+major+"</td>"+
                            "</tr>"
                        tb.append(html);
                    }
                }else {
                    alert("数据获取失败失败")
                }
            })
        }

        function deleteById(){
            let id =$('#delId').val()
            if (id!=""||id!=null){
                $.post("/class/delete",{
                id:id
                },function(res){
                    if (res=="ok"){
                        location.reload()
                    }else {
                        alert("删除失败")
                    }
                })
            }

        }

        function queryById(){
            let id =$('#delId').val()
            let tb = $('#tb')
            if (id!=""||id!=null){
                $.post("/class/query",{
                    id:id
                },function(res){
                    if (res!==null&&res!==undefined){
                        let className = res.className
                        let id = res.id
                        let date = res.date
                        let major = res.major
                        tb.html("<thead>" +
                            "<th>班级名</th>" +
                            "<th>id</th>" +
                            "<th>入学年份</th>" +
                            "<th>专业</th>" +
                            "</thead>"+
                            "<tr>"+
                            "<td>"+className+"</td>"+
                            "<td>"+id+"</td>"+
                            "<td>"+date+"</td>"+
                            "<td>"+major+"</td>"+
                            "</tr>")
                    }else {
                        alert("查询失败")
                    }
                })
            }
        }

        function updateById(){
            let className = $('#className').val();
            let id = $('#id').val();
            let date = $('#date').val();
            let major = $('#major').val();
            $.post("/class/update",{
                className:className,
                id:id,
                date:date,
                major:major
            },function (res) {
                if (res == "ok") {
                    location.reload()
                }else {
                    alert("修改失败")
                }
            })
        }

        $(function (){
            $('#submit').click(function (){
                add()
            })
            $('#delete').click(function (){
                deleteById()
            })
            $('#query').click(function (){
                queryById()
            })
            $('#update').click(function (){
                updateById()
            })
            loadData()
        })



    </script>
</body>
</html>